.orange-bar {
    height: 5px;
    background-color: #f39c12;
}

.logo img {
    margin: 20px 0 60px;
    max-width: 200px;
}

.dropdown-menu>li>a>i {
    padding-right: 10px;
    margin-left: -10px;
}

.menu {
    margin-top: 75px;
    font-size: 24px;
}

.menu a {
    color: #656565;
}

.menu a:hover {
    text-decoration: none;
    color: #f39c12;
}

h1 {
    color: #f39c12;
}

p a {
    color: #656565;
}

p a:hover {
    text-decoration: none;
    color: #f39c12;
}

.whatwedo {

    text-align: center
}

.projects {
    margin-top: 50px;
    text-align: center;
}

.projects h1 {
    font-size: 35px;
    color: #f39c12;
    padding-bottom: 10px;
}

.contact-header, .products-header {
    border-bottom: 2px solid #f6f4f6;
    padding-bottom: 10px;
}

.contact, .products {
    margin-top: 25px;
}

footer {

    padding: 20px 0 0 0;

    background-color: #f6f5f6
}

.social {
    padding: 8px 14px;
    border-radius: 3px;
    background-color: #ddd;
    transition: all .6s;
    -moz-transition: all .6s;
    -webkit-transition: all .6s;
    -o-transition: all .6s;
    color: #fff
}

.facebook:hover {
    background-color: #435fa8
}

.copyright {
    padding: 20px 0;
    font-size: 12px;
    color: #7a7a7a;
}

.blog-post-padding {
    padding-bottom: 25px;
}

#slh-logo {
    margin-top: 60px;
}

#middle-client-row {
    padding: 50px 0 25px 0;
}

#geng-logo {
    padding: 50px 0 25px 0;
}

@media (max-width:768px) {
    .logo {
        text-align: center;
        margin-bottom: 0;
    }

    .logo img {
        margin: 20px 0 20px 0;
    }

    .menu {
        margin-top: 0;
    }

    .menu a:hover {
        text-decoration: none;
        color: #f39c12;
    }

    h1 {
        color: #f39c12;
    }

    p a {
        color: #656565;
    }

    p a:hover {
        text-decoration: none;
        color: #f39c12;
    }

    .whatwedo {

        text-align: center;
    }

    .projects {
        margin-top: 50px;
        text-align: center;
    }

    .projects h1 {
        font-size: 35px;
        color: #f39c12;
        padding-bottom: 15px;
    }

    .contact-header, .products-header {
        border-bottom: 2px solid #f6f4f6;
        padding-bottom: 10px;
    }

    .contact, .products {
        margin-top: 25px;
    }

    footer {
        margin-top: 25px;
        padding: 20px 0 0 0;
        border-top: 1px solid #e7e7e7;
        background-color: #f6f5f6
    }

    .twitter-ramblings {
        margin-top: 30px;
    }

    .facebook:hover {
        background-color: #435fa8
    }

    .copyright {
        margin-top: 30px;
        padding: 20px 0;
        border-top: 1px solid #949494;
        font-size: 12px;
        color: #7A7A7A;
    }
}

/* Animation */

.animated {
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -ms-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s
}

.animated.hinge {
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -ms-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s
}

@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(20px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0)
    }
}

@-moz-keyframes fadeInUp {
    0% {
        opacity: 0;
        -moz-transform: translateY(20px)
    }
    100% {
        opacity: 1;
        -moz-transform: translateY(0)
    }
}

@-o-keyframes fadeInUp {
    0% {
        opacity: 0;
        -o-transform: translateY(20px)
    }
    100% {
        opacity: 1;
        -o-transform: translateY(0)
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px)
    }
    100% {
        opacity: 1;
        transform: translateY(0)
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    -moz-animation-name: fadeInUp;
    -o-animation-name: fadeInUp;
    animation-name: fadeInUp
}

@-webkit-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-20px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0)
    }
}

@-moz-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -moz-transform: translateX(-20px)
    }
    100% {
        opacity: 1;
        -moz-transform: translateX(0)
    }
}

@-o-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -o-transform: translateX(-20px)
    }
    100% {
        opacity: 1;
        -o-transform: translateX(0)
    }
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        transform: translateX(-20px)
    }
    100% {
        opacity: 1;
        transform: translateX(0)
    }
}

.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    -moz-animation-name: fadeInLeft;
    -o-animation-name: fadeInLeft;
    animation-name: fadeInLeft
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(20px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateX(0)
    }
}

@-moz-keyframes fadeInRight {
    0% {
        opacity: 0;
        -moz-transform: translateX(20px)
    }
    100% {
        opacity: 1;
        -moz-transform: translateX(0)
    }
}

@-o-keyframes fadeInRight {
    0% {
        opacity: 0;
        -o-transform: translateX(20px)
    }
    100% {
        opacity: 1;
        -o-transform: translateX(0)
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        transform: translateX(20px)
    }
    100% {
        opacity: 1;
        transform: translateX(0)
    }
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    -moz-animation-name: fadeInRight;
    -o-animation-name: fadeInRight;
    animation-name: fadeInRight
}